// 接收地址
const api = "http://127.0.0.1:8989/"

// 获取页面元素
const table_stu = document.getElementById("table_stu")
const ip_page = document.getElementById("ip_page")

// page
var page = {
    pageSize: 5,
    pageNum: 1,
    pageCount: 10
}

/**
 * 设置年龄段
 */
function setAge(age) {
    if (age > 27) {
        return "青年"
    } else {
        return "小年轻"
    }
}


/**
 * 将学生数据展示到表格
 */
function showOnTable(data) {
    // 表格内容
    var table_content = `
        <tr>
            <th>ID</th>
            <th>姓名</th>
            <th>性别</th>
            <th>年龄</th>
            <th>年龄段</th>
            <th>血型</th>
            <th>地址</th>
            <th>省份</th>
        </tr>
    `

    // 添加数据条目
    data.forEach(stu => {
        var row = `
            <tr>
                <td>${stu.id}</td>
                <td>${stu.name}</td>
                <td>${stu.sex}</td>
                <td>${stu.age}</td>
                <td>${setAge(stu.age)}</td>
                <td>${stu.blond}</td>
                <td>${stu.address}</td>
                <td>${stu.pro}</td>
            </tr>    
        `
        table_content += row
    });

    // 设置表格内容
    table_stu.innerHTML = table_content

    // 设置页数
    ip_page.value = page.pageNum
}

/**
 * 根据血型搜索学生
 */
function getStuByBlond(blond) {
    // 获取血型搜索值
    var blond = ip_blond.value

    // 请求接口获取数据
    fetch(api + `getStuByBlond?blond="${blond}"`)
        .then(response => {
            // 将响应解析为 JSON
            return response.json();
        })
        .then(data => {
            // 处理返回的数据
            console.log(data);
            showOnTable(data)
        })
}

/**
 * 分页查询学生数据
 */
function getStuList(page) {
    fetch(api + `getStuList?pageSize=${page.pageSize}&pageNum=${page.pageNum}`)
        .then(response => {
            // 将响应解析为 JSON
            return response.json();
        })
        .then(data => {
            // 处理返回的数据
            console.log(data);
            showOnTable(data)
        })
}
getStuList(page)


/**
 * 分页
 */
function getPre() {
    if (page.pageNum > 1) {
        page.pageNum -= 1
    }
    getStuList(page)
}

function getNext() {
    if (page.pageNum < page.pageCount) {
        page.pageNum += 1
    }
    console.log(page);

    getStuList(page)
}

function getPos() {
    page.pageNum = ip_page.value
    getStuList(page)
}

